import { Fragment, ReactElement, SetStateAction, useEffect, useRef, useState } from "react";
import lessModule from "./index.module.less"
import tagDelImage from "../../../../assets/image/homePage-multipleTagDel.png"
// 主页-标签组件
interface homePageTagComponentInterface {
    name: string
    click_del?: Function
}
const HomePage_TagComponent: React.FC<homePageTagComponentInterface> = (props) => {

    const click_del = (event: React.MouseEvent<HTMLImageElement, MouseEvent>) => {
        event.stopPropagation()
        props.click_del?.(props.name)
    }

    return (
        <div className={lessModule["homePageTagComponent"]}>
            <div className={lessModule["homePageTagComponent-label"]}>{props.name}</div>
            {
                props.click_del && <img className="homePage-handleImage" src={tagDelImage} onClick={(e) => click_del(e)} />
            }
        </div>
    )
}


export default HomePage_TagComponent